<template>
  <view class="feedback flex flex-center" @click="toFeedback" :style="{right: right + 'px', bottom: bottom + 'px'}">
    <i class="ic ic-feedback feedback-icon" />
    <text class="font">{{title}}</text>
  </view>
</template>

<script>
export default {
  name: 'Feedback',
  props: {
    bookId: {},
    id: {},
    from: {
      type: Number,
      default: 1
    },
    right: {
      type: Number,
      default: 20
    },
    bottom: {
      type: Number,
      default: 100
    },
    title: {
      type: String,
      default: '反馈'
    }
  },
  methods: {
    toFeedback () {
      uni.navigateTo({
        url: `/pages/other/feedback/index?bookId=${this.bookId}&from=${this.from}&h5Id=${this.id}`
      })
      if (this.from === 2) {
        uni.flux.track.commonTrackEvent({
          category: '聚合页反馈按钮点击',
          action: 'init',
          property: ''
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.feedback{
  position: fixed;
  z-index: 98;
  justify-content: center;
  align-items: center;
  width: 144rpx;
  color: #565656;
  height: 72rpx;
  background: #FFFFFF;
  box-shadow: 0px 4px 14px 0px rgba(165, 165, 165, 0.5);
  border-radius: 34px;
  .feedback-icon{
    position: relative;
    top: 1px;
    left: 0;
    font-size: 16px;
    margin-right: 2rpx;
  }
  .font{
    font-size: 14px;
  }

}
</style>
